import { Form, Modal, message, Input, Select } from 'antd'
import React, { useEffect } from 'react'
import { awaitWrap } from '@js/tool'
import { $put } from '@src/assets/js/authRequest'
import Text from '@components/Text'
import style from './Index.module.less'

const { Item, useForm } = Form
const { TextArea } = Input
const { Option } = Select

async function updateRequest (id, d) {
  d.audit_datetime = Math.floor(Date.now() / 1000)
  const res = await $put(`/api/mgt/protectedapi/institution/updateWithAudit/${id}`, d)
  if (res.status !== 1) {
    throw new Error(res.message)
  }
  return res.data
}

async function submitHandle (id, d, callback) {
  const hide = message.loading('提交中', 120)
  const [e] = await awaitWrap(updateRequest(id, d))
  hide()
  if (e === null) {
    message.success('提交成功', 1)
    callback()
  } else {
    message.error(e.message)
  }
}

function initForm (data, formRef) {
  data.status = undefined
  formRef.setFieldsValue(data)
}

function Main ({ data, visible, hide, refreshFn }) {
  const [formRef] = useForm()
  useEffect(() => {
    if (formRef && data && visible) {
      initForm(data, formRef)
    }
  }, [formRef, data, visible])
  useEffect(() => {
    if (formRef && !visible) {
      formRef.resetFields()
    }
  }, [visible, formRef])
  return (
    <Modal title='审核操作' open={visible} onCancel={hide} onOk={() => formRef.submit()} forceRender>
      <Form form={formRef} labelCol={{ flex: '100px' }} onFinish={d => submitHandle(data.id, d, () => { hide(); refreshFn() })}>
        <Item name='type' label='审批类型' className={style.item}>
          <Text />
        </Item>
        <Item noStyle shouldUpdate={(e, c) => e.apply_remark !== c.apply_remark}>
          {({ getFieldValue }) => {
            const c = getFieldValue('apply_remark')
            if (c) {
              return (
                <Item name='apply_remark' label='备注' className={style.item}>
                  <Text />
                </Item>
              )
            }
          }}
        </Item>
        <Item noStyle shouldUpdate={(e, c) => e.institution_name_source !== c.institution_name_source}>
          {({ getFieldValue }) => {
            const c = getFieldValue('institution_name_source')
            if (c) {
              return (
                <Item name='institution_name_source' label='原名称' className={style.item}>
                  <Text />
                </Item>
              )
            }
          }}
        </Item>
        <Item noStyle shouldUpdate={(e, c) => e.institution_name_target !== c.institution_name_target}>
          {({ getFieldValue }) => {
            const c = getFieldValue('institution_name_target')
            if (c) {
              return (
                <Item name='institution_name_target' label='新名称' className={style.item}>
                  <Text />
                </Item>
              )
            }
          }}
        </Item>
        <Item name='status' label='操作' rules={[{ required: true, message: '操作不能为空' }]}>
          <Select placeholder='请选择' allowClear>
            <Option value='审核通过'>审核通过</Option>
            <Option value='审核不通过'>审核不通过</Option>
          </Select>
        </Item>
        <Item noStyle shouldUpdate={(e, c) => e.status !== c.status}>
          {({ getFieldValue }) => {
            const c = getFieldValue('status')
            if (c === '审核不通过') {
              return (
                <Item name='audit_remark' label='审批意见'>
                  <TextArea placeholder='请输入' allowClear />
                </Item>
              )
            }
          }}
        </Item>
      </Form>
    </Modal>
  )
}

export default Main
